ink-spinner

What is ink-spinner?

The ink-spinner npm package provides a collection of customizable spinner components for use with Ink, a React-like library for building command-line interfaces. It allows developers to add loading spinners to their CLI applications, enhancing the user experience by indicating ongoing processes.

What are ink-spinner's main functionalities?

Basic Spinner

This feature demonstrates how to use a basic spinner in an Ink application. The spinner type is set to 'dots', and it is displayed alongside a 'Loading...' message.

const { render } = require('ink');
const Spinner = require('ink-spinner').default;
const React = require('react');

const App = () => (
  <div>
    <Spinner type="dots" /> Loading...
  </div>
);

render(<App />);

Custom Spinner Type

This feature shows how to use a custom spinner type. In this example, the spinner type is set to 'line', and it is displayed with a 'Processing...' message.

const { render } = require('ink');
const Spinner = require('ink-spinner').default;
const React = require('react');

const App = () => (
  <div>
    <Spinner type="line" /> Processing...
  </div>
);

render(<App />);

Spinner with Custom Color

This feature demonstrates how to customize the color of the spinner. The spinner type is 'dots', and it is wrapped in a Color component to display it in green.

const { render } = require('ink');
const Spinner = require('ink-spinner').default;
const React = require('react');
const { Color } = require('ink');

const App = () => (
  <div>
    <Color green>
      <Spinner type="dots" /> Loading...
    </Color>
  </div>
);

render(<App />);

Other packages similar to ink-spinner

ora

Ora is a terminal spinner library that provides a variety of spinner styles and options for customization. Unlike ink-spinner, which is designed specifically for use with Ink, Ora can be used in any Node.js CLI application. It offers more configuration options and supports promises for handling asynchronous operations.

cli-spinners

Cli-spinners is a collection of various spinner animations for use in command-line interfaces. It provides a wide range of spinner styles that can be used with any CLI application. While it does not provide a React-like component structure like ink-spinner, it offers a simple way to integrate spinners into any Node.js project.

listr

Listr is a library for creating elegant CLI task lists with spinners. It allows developers to define tasks with spinners that indicate progress. Unlike ink-spinner, which focuses solely on spinners, Listr provides a more comprehensive solution for managing and displaying task progress in CLI applications.

README

ink-spinner

Spinner component for Ink. Uses cli-spinners for the collection of spinners.

Install

$ npm install ink-spinner

Usage

const {h, render} = require('ink');
const Spinner = require('ink-spinner');

render((
	<div>
		<Spinner green/> Loading
	</div>
));

Props

All props except the own ones listed below are passed as-is to <Color>, which means you can easily apply any color, without wrapping <Spinner> in <Color> manually.

type

Type: string
Defaults: dots

Type of a spinner. See cli-spinners for available spinners.

License

MIT © Vadim Demedes